{% extends 'demo/base.html' %}
{% load common_extras %}
{% load static %}
{% block link %}
    <link rel="stylesheet" href="{% static 'css/demo/user_article.css' %}">
{% endblock %}
{% block title %}
    创作中心
{% endblock %}
{% block header %}
    {% include 'demo/header.html' %}
{% endblock %}
{% block main %}
    <div class="content">
        <div class="container">
            <!-- 访问创作中心 -->
            <a href="{% url 'ArticleUser' %}"><h1>创作中心</h1></a>
            <div class="article-list">
                {% if pages %}
                    {% for article in pages %}
                        <div class="article-item">
                            <div class="article-content">
                                <!-- 访问文章详情 -->
                                <h2><a href="{% url 'ArticleDetail' article.id %}">{{ article.title }}</a></h2>
                                <p class="desc">{{ article.desc }}</p>
                                <div class="meta">
                                    <span>发布时间: {{ article.create_time|date:"Y-m-d H:i" }}</span>
                                    <span>分类: {{ article.classes.name }}</span>
                                    <span>文章标签:</span>
                                    {% for label in article.label.all %}
                                        <span class="tag">{{ label.name }}</span>
                                    {% empty %}
                                        <span class="tag">暂无标签</span>
                                    {% endfor %}
                                </div>
                                <div class="func">
                                    <a href="/demo/article/update/{{ article.id }}" class="btn-update">修改</a>
                                    <a href="/demo/article/delete/{{ article.id }}" class="btn-delete">删除</a>
                                    <a href="/demo/article/add/" class="btn-add">发布</a>
                                </div>
                            </div>
                            <div class="right">
                                <img src="/static/media/{{ article.cover }}/" alt="{{ article.title }}">
                            </div>
                        </div>
                    {% endfor %}

                    <!-- 分页 -->
                    <div class="pagination">
                    <span class="step-links">
                        {% if pages.has_previous %}
                            <a href="{% url 'ArticleUser' %}?page=1">&laquo; 首页</a>
                            <a href="{% url 'ArticleUser' %}?page={{ pages.previous_page_number }}">上一页</a>
                        {% endif %}

                        <span class="current">
                            第 {{ pages.number }} 页，共 {{ pages.paginator.num_pages }} 页
                        </span>

                        {% if pages.has_next %}
                            <a href="{% url 'ArticleUser' %}?page={{ pages.next_page_number }}">下一页</a>
                            <a href="{% url 'ArticleUser' %}?page={{ pages.paginator.num_pages }}">末页 &raquo;</a>
                        {% endif %}
                    </span>
                    </div>
                {% else %}
                    <p>暂无文章</p>
                {% endif %}
            </div>
        </div>
    </div>
{% endblock %}
